{% extends 'client_portal/base.html' %}{% load portal_tags %}{% block content %}
<div class="portal-hero"><div><p>BEM-VINDO, {{ portal_access.display_name|upper }}</p><h2>Está tudo sob controlo.</h2><span>Acompanhe os serviços e fale connosco sem depender de emails dispersos.</span></div><a class="portal-button portal-button--dark" href="{% url 'client_portal:ticket_create' %}">+ Novo ticket</a></div>
<div class="portal-stat-grid">
  <article class="portal-stat"><span class="stat-icon stat-icon--green">◈</span><div><small>Serviços</small><strong>{{ services_count }}</strong><p>Associados à sua conta</p></div></article>
  <article class="portal-stat"><span class="stat-icon stat-icon--amber">↻</span><div><small>Renovações em 30 dias</small><strong>{{ upcoming_count }}</strong><p>Próximos vencimentos</p></div></article>
  <article class="portal-stat"><span class="stat-icon stat-icon--red">€</span><div><small>Valor pendente</small><strong>{{ outstanding|euro }}</strong><p>Pagamentos por regularizar</p></div></article>
  <article class="portal-stat"><span class="stat-icon stat-icon--blue">✉</span><div><small>Tickets abertos</small><strong>{{ open_ticket_count }}</strong><p>{{ unread_ticket_count }} mensagens por ler</p></div></article>
  <article class="portal-stat"><span class="stat-icon stat-icon--green">◉</span><div><small>Websites monitorizados</small><strong>{{ monitor_count }}</strong><p>{{ monitor_down_count }} indisponíveis</p></div></article>
</div>
<div class="portal-grid portal-grid--2">
  <section class="portal-card"><div class="portal-card-head"><div><p>CALENDÁRIO</p><h3>Próximas renovações</h3></div><a href="{% url 'client_portal:renewals' %}">Ver todas</a></div>{% if next_renewals %}<div class="portal-list">{% for item in next_renewals %}<a href="{% url 'client_portal:service_detail' item.service_id %}"><div><strong>{{ item.service.name }}</strong><small>{{ item.due_date|pt_date }}</small></div><span class="status status--{{ item.status|status_tone }}">{{ item.get_status_display }}</span></a>{% endfor %}</div>{% else %}<div class="portal-empty">Não existem renovações futuras registadas.</div>{% endif %}</section>
  <section class="portal-card"><div class="portal-card-head"><div><p>SUPORTE</p><h3>Conversas recentes</h3></div><a href="{% url 'client_portal:tickets' %}">Ver tickets</a></div>{% if recent_tickets %}<div class="portal-list">{% for ticket in recent_tickets %}<a href="{% url 'client_portal:ticket_detail' ticket.pk %}"><div><strong>{{ ticket.reference }} · {{ ticket.subject }}</strong><small>{{ ticket.last_activity_at|date:'d/m/Y H:i' }}</small></div><span class="status status--{{ ticket.status|status_tone }}">{{ ticket.get_status_display }}</span></a>{% endfor %}</div>{% else %}<div class="portal-empty">Ainda não existem pedidos de suporte.</div>{% endif %}</section>
</div>
<section class="portal-card portal-section-spaced"><div class="portal-card-head"><div><p>MONITORIZAÇÃO</p><h3>Estado dos websites</h3></div><a href="{% url 'client_portal:monitoring' %}">Ver monitorização</a></div>{% if monitored_services %}<div class="portal-list">{% for monitor in monitored_services %}<a href="{% url 'client_portal:monitoring' %}"><div><strong>{{ monitor.name }}</strong><small>{% if monitor.last_response_ms %}{{ monitor.last_response_ms }} ms · {% endif %}{{ monitor.last_checked_at|date:'d/m/Y H:i'|default:'Por verificar' }}</small></div><span class="status status--{{ monitor.status|status_tone }}">{{ monitor.get_status_display }}</span></a>{% endfor %}</div>{% else %}<div class="portal-empty">Ainda não existem websites monitorizados.</div>{% endif %}</section>
{% endblock %}